<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>两栏布局</title>
<style>
html, body, div, p {
    margin: 0;
    padding: 0
}
.wraper {
    max-width:1140px; margin:0 auto; overflow:hidden;
}
h3{padding:0 20px}
.col-sub {width:200px; background:#000;color:#fff;margin-bottom: -3000px;padding-bottom: 3000px; float:left; margin-left:-100%;}
.col-extra{width:200px;background:#efefef;margin-bottom: -3000px;padding-bottom: 3000px; float:left; margin-left:-200px;}
.col-main {width:100%;margin-bottom: -3000px;padding-bottom: 3000px;float: left}
.col-main .main-con {padding-left:200px;padding-right:200px}
.col-main .main-con p {padding: 20px}
</style>
</head>

<body>
<div class="wraper">
    <div class="col-main">
        <div class="main-con">
            <h3>主体内容区块</h3>
            <p>我入前端这行小两年了，之前感觉前端就是排排版，找找js效果，但前些日子换工作，面试了不少家，然后发现自己的水平真的很有限。现在我想把自己的水平提高一下。
                javascript,jquery，这两样要怎么去学习，我也看过些视频，书籍之类的，但平常不怎么用，过些日子也就忘的差不多了。这个要怎么去提高呢？
                html5这个东西手机web页面用的多吗？有没有使用html5写的手机web网站，发些网址出来看一下呢。。
                css3,这个我看w3school里面东西不多啊，这个还有别的学习的地方吗？能学到更多的东西。</p>
        </div>
    </div>
    <div class="col-sub">
        <h3>左侧侧功能导航区块</h3>
    </div>
    <div class="col-extra">
        <h3>右侧辅助功能区</h3>
    </div>
</div>
</body>
</html>